<extend name="Public/base"/>

<block name="body">
  <!-- 标题栏 -->
  <div class="main-title">
    <h2>购票列表测试</h2>
  </div>
  <!-- <button onclick="printtest()">打印测试</button> -->
  <!-- 数据列表 -->
  <div class="data-table buytickets-list">
    <div class="data-table table-striped">
      <table>
        <!-- 表头 -->
        <thead>
          <tr>
            <th>展览</th>
            <th>票务名称</th>
            <th>单价/元</th> 
            <th>开始日期</th>
            <th>结束日期</th>
            <th>库存/张</th>
            <th>购票</th>
          </tr>
        </thead>

        <!-- 列表 -->
        <tbody>
          <volist name="list_data" id="data">
            <tr>
              <td>{$data.ex_name}</td>
              <td>{$data.name}</td>
              <td>{$data.price}</td>
              <td>{$data.begin_date}</td>
              <td>{$data.end_date}</td>
              <td>{$data.stock}</td>
              <td><button class="btn btn-primary" onclick="scanOpen({$data.id})">购买</button></td> 
            </tr>
          </volist>
        </tbody>
      </table>
    </div>
  </div>
  <div class="scancover buyticket">
    <!-- 购买弹窗 -->
    <div class="box orderinfo">
      <i class="fa fa-close" onclick="scanClose()"></i>
      <!-- <div class="info">
        <span><b>展览：</b>ddd</span>
        <span><b>票务名称：</b>sss</span>
        <span><b>单价：</b></span>
      </div> -->
      <p style="padding:20px 0 10px;font-size: 14px;">输入购买张数：</p>
      <div class="putin">
        <input type="number" place="购买张数" id="scaninput">
      </div>
      <div class="payment">
        <p>支付方式：</p>
        <label for="wechat"><input type="radio" name="payment" value="1" id="wechat">微信支付</label>
        <!-- <label for="alipay"><input type="radio" name="payment" value ="2" id="alipay">支付宝支付</label> -->
        <label for="cash"><input type="radio" name="payment" value ="3" id="cash">现金支付</label>
      </div>
      <p style="padding-top: 10px;font-size: 16px;">总价：<span class="total">0</span> 元</p>
      <button class="btn btn-primary" onclick="buy()">购买</button>
    </div>
    <!-- 微信、支付宝支付弹窗 -->
    <div class="box payinfo">
      <i class="fa fa-close" onclick="payClose()"></i>
      <p class="payinfo-input">请客户出示付款码并扫码</p>
      <input type="number" place="付款码" id="payinput">
      <p style="padding-top: 10px;font-size: 16px;">总价：<span class="total">0</span> 元</p>
      <button class="btn btn-primary" onclick="pay()">支付</button>
    </div>
  </div>
  <!--startprint-->
  <div class="print_res"></div>
  
  <!--endprint-->
</block>

<block name="script">
<script type="text/javascript" src="__JS__/JsBarcode.all.js"></script>
<script type="text/javascript">
var ticket = null;
function exchangeRedeemcode(redeem_id){
  $.ajax({
    type : 'post',
    url : 'index.php?s=Admin/Redeemcode/exchangeRedeemcode',
    data : { id : redeem_id},
    success: function(data){
      console.log(data);
      window.location.reload();
    }
  })
}

function scanOpen(ticket_id){
  $.ajax({
    type : 'get',
    url : 'index.php?s=Admin/Buytickets/ticketinfo&ticketId='+ticket_id,
    success: function(data){
      ticket = data.info;
      $('.scancover .box').prepend("<div class='info'><span><b>展览：</b>"+ticket.ex_name+"</span><span><b>票务名称：</b>"+ticket.name+"</span><span><b>单价：</b>"+ticket.price+"/元</span></div>");
      $('.scancover').show();
      $('.scancover .orderinfo').show();
      $('#scaninput').focus();    
    }
  })
}

function scanClose(){
  $('#scaninput').val('');
  $("input[type='radio']").removeAttr("checked");
  $('.info').remove();
  $(".total").replaceWith("<span class='total'>0</span>");
  $('.scancover .orderinfo').hide();
  $('.scancover').hide();
  ticket = null;
}

$('#scaninput').bind('input propertychange', function() {
  var ticketNum = $('#scaninput').val();
  if(ticketNum<0){
    $('#scaninput').val('');
  }else{
    $(".total").replaceWith("<span class='total'>"+ticket.price*ticketNum+"</span>");
  }
});

function buy(){
  var payment = $("input[type='radio']:checked").val();
  var ticketNum = $('#scaninput').val();
  if(!payment){
    alert('请选择支付方式！');
  }else if(!ticketNum){
    alert('请输入购买张数！');
  }
  else{
    if(confirm('是否确认购买？')){
      $.ajax({
        type : 'post',
        url : 'index.php?s=Admin/Buytickets/buy1',
        data: {
          ticket_id: ticket.id,
          amount: ticketNum,
          payment: payment
        },
        success: function(data){
          if(data.status==0){
            alert(data.info);
          }else{
            if(data.info['payment']=='3'||data.info['price']=="0.00"){
              //现金支付
              //票券打印
              printtest(data.info['ticketlist']);
              console.log(data);
            }else{
              //微信或支付宝支付
              ticket['payment_id'] = data.info['order_id'];
              ticket['payment'] = payment;
              payOpen();
            }
          }
        }
      });
    } 
  }
}

// 打开支付扫码框
function payOpen(payinfo){
  $('.scancover .orderinfo').hide();
  $('.scancover .payinfo').show();
  $('#payinput').focus();
}
//关闭支付扫码框
function payClose(){
  $('#scaninput').val('');
  $("input[type='radio']").removeAttr("checked");
  $('.info').remove();
  $(".total").replaceWith("<span class='total'>0</span>");
  $('.scancover .orderinfo').hide();
  $('.scancover .payinfo').hide();
  $('.scancover').hide();
  ticket = null;
}

function pay(){
  var paycode = $('#payinput').val();
  if(paycode){
    $.ajax({
      type : 'post',
      url : 'index.php?s=Admin/Buytickets/pay',
      data: {
        pay_code: paycode,
        order_id: ticket['payment_id'],
        payment: ticket['payment']
      },
      success: function(data){
        if(data.status==0){
          alert(data.info);
        }else{
          printtest(data.info['ticketlist']);
        }
      }
    });
  }else{
    alert('请扫描用户支付码');
  }
}

function printtest(data){
  if(data&&data.length>0){
    for(var i=0;i<data.length;i++){

      //拼接每张票字符串
      var single = '<p class="line-one">'+data[i]['exhibition_name']+'</p><p class="line-two">'+data[i]['ticket_name']+'</p><p>RMB '+data[i]['price']+'</p><img id="barcode'+data[i]['id']+'" class="qrimg"/><p class="line-three">'+data[i]['redeem_code']+'</p><p class="line-four" style="page-break-after:always">'+data[i]['create_time']+'</p>';
      $(".print_res").append(single);
      JsBarcode("#barcode"+data[i]['id'], data[i]['redeem_code'], {
        format: "CODE128",
        displayValue: false,
      });
    }
    
    bdhtml=window.document.body.innerHTML; 
    sprnstr="<!--startprint-->"; //开始打印标识字符串有17个字符
    eprnstr="<!--endprint-->"; //结束打印标识字符串
    prnhtml=bdhtml.substr(bdhtml.indexOf(sprnstr)+17); //从开始打印标识之后的内容
    prnhtml=prnhtml.substring(0,prnhtml.indexOf(eprnstr)); //截取开始标识和结束标识之间的内容
    prnhtml=prnhtml+"<style>body{padding:0}.print_res{display:block !important}</style>";
    window.document.body.innerHTML=prnhtml; //把需要打印的指定内容赋给body.innerHTML
    setTimeout(function(){
      window.print();
      history.go(0);
    },1000);
    
     //调用浏览器的打印功能打印指定区域
    // 
    // window.document.body.innerHTML=bdhtml;//重新给页面内容赋值；
  }
  
}
    
</script>
</block>
